<div id="editBorrowModal" class="fixed inset-0 bg-gray-900 bg-opacity-60 flex items-center justify-center hidden z-50">
    <div class="bg-white p-8 rounded-xl shadow-2xl max-w-md w-full mx-4">
        <h2 class="text-2xl font-bold mb-6">编辑借阅记录</h2>
        <form id="editBorrowForm" action="UpdateBorrow.php" method="POST" class="space-y-6">
            <input type="hidden" name="borrow_id" id="editBorrowId"> <!-- 存储借阅记录ID -->

            <!-- 还书时间 -->
            <div>
                <label for="editReturnTime" class="block text-sm font-semibold mb-2">还书时间</label>
                <input type="datetime-local" id="editReturnTime" name="return_time" class="w-full px-4 py-2.5 border rounded-lg">
            </div>

            <!-- 还书状态 -->
            <div>
                <label class="block text-sm font-semibold mb-2">还书状态 <span class="text-red-500">*</span></label>
                <select id="editStatus" name="status" class="w-full px-4 py-2.5 border rounded-lg">
                    <option value="0">未归还</option>
                    <option value="1">已归还</option>
                </select>
            </div>

            <!-- 按钮 -->
            <div class="flex justify-end gap-4 mt-6">
                <button type="button" id="closeEditModal" class="px-4 py-2 bg-gray-200 rounded hover:bg-gray-300">取消</button>
                <button type="submit" class="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">保存修改</button>
            </div>
        </form>
    </div>
</div>

<script>
    document.addEventListener('DOMContentLoaded', () => {
        const editBtns = document.querySelectorAll('.edit-btn');
        const modal = document.getElementById('editBorrowModal');
        const closeBtn = document.getElementById('closeEditModal');

        // 点击编辑按钮时填充数据并显示模态框
        editBtns.forEach(btn => {
            btn.addEventListener('click', () => {
                const data = btn.dataset;
                // 填充表单数据（从borrow.php的编辑按钮data属性获取）
                document.getElementById('editBorrowId').value = data.id; // 假设borrow.php的编辑按钮有data-id属性
                document.getElementById('editReturnTime').value = data.returnTime ? data.returnTime.replace(' ', 'T') : ''; // 转换为datetime-local格式
                document.getElementById('editStatus').value = data.status; // 假设borrow.php的编辑按钮有data-status属性
                // 显示模态框
                modal.classList.remove('hidden');
            });
        });

        // 关闭模态框
        closeBtn.addEventListener('click', () => modal.classList.add('hidden'));
        modal.addEventListener('click', (e) => {
            if (e.target === modal) modal.classList.add('hidden');
        });
    });
</script>
